import { useState, useRef } from "react"
import { Button, message } from 'antd'
import style from './index.module.less'
import { editBL } from '@/services/mz'
import Editor from '../Editor'
import { STATUS_CODE } from '@/common/const'

type Props = {
    id: string
    onSave: () => void
    content: string
}
export default (props: Props) => {
    const { id, onSave, content } = props
    const [loading, setLoading] = useState(false)
    const editorRef = useRef<any>(null)

    const handleSave = async () => {
        try {
            setLoading(true)
            const html = editorRef.current?.getHtml();
            const result = await editBL({ content: html, blId: id })
            if (result.code === STATUS_CODE.SUCCESS) {
                message.success('保存成功')
                onSave();
            } else {
                message.error(result.message);
            }
        } catch (error) {
            message.error('保存失败')
        } finally {
            setLoading(false);
        }
    }
    return (
        <div className={style.addMedical}>
            <div className={style.content}>
                <Editor content={content} ref={editorRef} readonly={false} />
            </div>
            <div className={style.button}>
                <Button type="primary" onClick={handleSave} loading={loading}>保存病历</Button>
            </div>
        </div>
    )
}